<template>
	<div class="screen">
		<div class="head">
			<input type="text" />
			<router-link tag='span' to="/bill">取消</router-link>
		</div>
		<div class="con">
			<div class="s">
				<span>物理</span>
				<span>三角函数</span>
				<span>化学</span>
			</div>
			<div class="e">
				<span>英语现在进行时</span>
				<span>9月账单</span>
			</div>
		</div>
	</div>
</template>

<script>
	export default{
		name:"screen",
		data(){
			return{
				
			}
		}
	}
</script>

<style lang="less">
	.screen{
		.con{
			margin-top: 10/50rem;
			margin-left: 20/50rem;
			.s{
				span{
					padding: 10/50rem 10/50rem;
					background: #ddd;
					font-size: 16/50rem;
					border-radius: 5/50rem;
				}
			}
			.e{
				margin-top: 0/50rem;
				span{
					padding: 10/50rem 10/50rem;
					background: #ddd;
					font-size: 16/50rem;
					border-radius: 5/50rem;
				}
				
			}
		}
		.head{
			height: 50/50rem;
			background: #3AAE95;
			line-height: 50/50rem;
			input{
				float: left;
				display: block;
				font-size: 16/50rem;
				background: #fff;
				height: 30/50rem;
				width: 280/50rem;
				margin-left: 20/50rem;
				border-radius: 10/50rem;
				margin-top: 10/50rem;
			}
			span{
				float: left;
				font-size: 16/50rem;
				display: block;
				color:#fff;
				margin-left: 16/50rem;
				line-height: 50/50rem;
			}
		}
	}
</style>